<template>
	<view
		class="payBox"
		:style="{
			background: row.background
		}"
	>
		<text
			class="iconfont "
			:class="row.icon || 'icon-money-finance-seller-fill'"
			:style="{
				background: row.iconBackground
			}"
		></text>
		<view class="payBox-item">
			<view class="payBox-title countTitle">
				{{ `${row.label}总额` }}
			</view>
			<view class="payBox-main countNumber">
				{{ `${data[row.priceKey] || 0}` }}
			</view>
		</view>
		<view class="payBox-item">
			<view class="payBox-title countTitle">
				{{ `${row.label}单数` }}
			</view>
			<view class="payBox-main countNumber">
				{{ `${data[row.numberKey] || 0}` }}
			</view>
		</view>
	</view>
</template>

<script lang="uts" setup>
//公共状态
import { useVue  } from '@/utils/useVue.uts'
const { reactive, ref,app,Token,onMounted,watch,http,goToPage } = useVue()
interface Props {
	data ?: any,//数据
	row?:any
}
const props = withDefaults(defineProps<Props>(), {

})
// 表单数据
const formData:any = reactive({

})
//搜索
</script>

<style scoped lang="scss">
.payBox {
	display: flex;
	padding: 16rpx;
	border-radius: 8rpx;
	.iconfont {
		width: 60rpx;
		height: 60rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		background: #999;
		border-radius: 8rpx;
		overflow: hidden;
		margin-right: 32rpx;
		color: #fff;
		box-shadow: 0 4rpx 6rpx 0 rgba(0, 0, 0, 0.1);
	}
	.payBox-item {
		flex: 1;
		overflow: hidden;
		.payBox-title {
		}
		.payBox-main {
			margin-top: 8rpx;
		}
	}
}
</style>
